<template>
  <el-table :data="data" border highlight-current-row style="width: 100%;margin-top:20px;">
    <template v-for="item in dataTitle">
      <table-column v-if="item.childrens && item.childrens.length" :key="item.id" :data-header="item"></table-column>
      <el-table-column v-else :key="item.id" :label="item.title" :prop="item.field" align="center"></el-table-column>
    </template>
  </el-table>
</template>

<script>
import TableColumn from './TableColumn'
export default {
  props: {
    // 表格的数据
    data: {
      type: Array,
      required: true
    },
    // 多级表头的数据
    dataTitle: {
      type: Array,
      required: true
    }
  },
  computed: {
    init:function(){
    console.log(this.data)
    }

  },
  components: {
    TableColumn
  }
}
</script>

<style scoped>

</style>
